import MyContext from "./context";
import { useContext } from "react";
import { useRef } from "react";

export default function MyList(props) {
  const { state, dispatch } = useContext(MyContext)
  const input1 = useRef()
  return (
    <>
      <h3>List组件: count: {state.count}</h3>
      {
        state.list.map((el, index) => {
          return <p key={index}>{el}</p>
        })
      }
      <input type="text" ref={input1} />
      <button type="button" onClick={() => {
        let v = input1.current.value;
        input1.current.value = ""
        dispatch({ type: 'addList', payload: v })
      }}>add </button>
    </>
  )

}